﻿<div class="container">
    <h2>
        Skill Types 2
    </h2>
    <div ng-if="!skillTypes.length">
        There are no skill types
    </div>
    <div ng-if="skillTypes.length">

        <div class="row" ng-repeat="st in skillTypes">
            <!--<span class="row">-->

            <a title="click to see associated skills with {{st.name}}" class="col-md-3h" ng-href='/joesweb/skills/{{st.id}}'>{{st.name}}</a>
            <button title="edit {{st.name}}" class="btn btn-xs btn-info col-md-1h" ng-click="edit(st)"><i class="glyphicon glyphicon-edit"></i></button>  
            <button title="remove {{st.name}}" class="btn btn-xs btn-danger col-md-1h" ng-click="remove(st)"><i class="glyphicon glyphicon-remove"></i></button>

            <!--</span>-->
        </div>

    </div>
    <div>
        <br/>
        <button ng-click="addSkillType()" class="btn btn-info">Add a new skill type</button>    
    </div>
    
</div>
